<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>传智云课堂</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no" id="viewport" />
<link rel="shortcut icon" href="favicon1.ico" />
<!--[if lte ie 8]>
	<link rel="stylesheet" type="text/css" href="css/global.css"/>
	<link rel="stylesheet" type="text/css" href="css/index.css"/>
	<script src="js/html5shiv.min.js"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="css/y-global.css"/>
<link rel="stylesheet" type="text/css" href="css/y-index.css"/>
<link rel="stylesheet" href="" id="styleCss"/>
<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/TouchSlide.1.1.js"></script>
<script src="js/jquery.lazyload.min.js"></script>
<script src="js/index.js"></script>
	<script>
		$(function() {
			$("img").lazyload({
				placeholder : "images/loading.gif",
				effect: "fadeIn"
			});
		});

	</script>
	<script type="text/javascript">
		window.onload = function() {

			function client() {
				if(window.innerWidth != null)  // ie9 +  最新浏览器
				{
					return {
						width: window.innerWidth,
						height: window.innerHeight
					}
				}
				else if(document.compatMode === "CSS1Compat")  // 标准浏览器
				{
					return {
						width: document.documentElement.clientWidth,
						height: document.documentElement.clientHeight
					}
				}
				return {   // 怪异浏览器
					width: document.body.clientWidth,
					height: document.body.clientHeight
				}
			}
			var styleCss = document.getElementById("styleCss");
			window.onresize = reSize;
			function reSize() {
				var clientWidth = client().width;
				if(clientWidth > 980)
				{
					styleCss.href = "";
				}
				else if(clientWidth > 640)
				{
					styleCss.href = "css/pad.css";
				}
				else
				{
					styleCss.href = "css/mobile.css";
				}
			}
		}
	</script>

</head>
<body>
<!--头部start-->
<header class="site-nav">
	<div class="nav-inner wrap">
		
		<div class="line">
			<div class="line1"></div>
			<div class="line2"></div>
			<div class="line3"></div>
		</div>
		
    	<div class="yunLogo">
        	<h1>
            	<a href="http://yun.itcast.cn" title="云课堂">云课堂</a>
				<span>传智云课堂</span>
            </h1>
        </div>
    	<nav class="nav">
        	<ul>
        		<li><a href="#" class="current">首页</a></li>
        		<li><a href="#">课程</a></li>
        		<li><a href="#">每日作业</a></li>
        		<li><a href="#">免费视频</a></li>
        		<li><a href="#">免费直播厅</a></li>
        		<li><a href="#">问答</a></li>
        		<li><a href="#">学习指南</a></li>
        		<li><a href="#">个人中心</a></li>
        	</ul>
        </nav>
		<nav class="nav nav1">
			<ul>
				<li><a href="#" class="current">首页</a></li>
				<li><a href="#">课程</a></li>
				<li><a href="#">每日作业</a></li>
				<li><a href="#">免费直播厅</a></li>
				<li><a href="#">问答</a></li>
			</ul>
		</nav>
		<div class="user"></div>
    	<div class="user-btn">
        	<a href="#" class="login">登录</a>
            <a href="#" class="register">注册</a>
        </div>

    </div>
</header>
<!--头部end-->
<!--banner start-->
<div class="banner">
	<ul class="slide">
		<li></li>
		<li></li>
		<li></li>
	</ul>
	<div class="disc">
    	<ul>
    		<li class="current"></li>
    		<li></li>
    		<li></li>
    	</ul>
    </div>
</div>


<!-- 本例主要代码 Start ================================ -->
<div id="focus" class="focus">
	<div class="hd">
		<ul></ul>
	</div>
	<div class="bd">
		<ul>
			<li><a href="#"><img _src="images/banner-x1.jpg" src="images/banner-x1.jpg" /></a></li>
			<li><a href="#"><img _src="images/banner-x2.jpg" src="images/banner-x2.jpg"/></a></li>
			<li><a href="#"><img _src="images/banner-x3.jpg" src="images/banner-x3.jpg"/></a></li>
		</ul>
	</div>
</div>
<script type="text/javascript">
	TouchSlide({
		slideCell:"#focus",
		titCell:".hd ul", //开启自动分页 autoPage:true ，此时设置 titCell 为导航元素包裹层
		mainCell:".bd ul",
		effect:"left",
		autoPlay:true,//自动播放
		autoPage:true, //自动分页
		switchLoad:"_src" //切换加载，真实图片路径为"_src"
	});
</script>
<!-- 本例主要代码 End ================================ -->

<!--banner end-->

<!--免费专区 start-->
<div class="free">
   <div class="inner wrap">
   	  <h2>免费专区</h2>
      <p>天下没有免费的午餐，传智云课堂有免费的学习</p>
      <div class="free-desk">
      	<ul>
      		<li>
            	<a href="#">
					<img src="images/loading.gif" data-original="images/free_03.jpg">
                </a>
            </li>
      		<li class="free-desk-m">
            	<a href="#">
					<img src="images/loading.gif" data-original="images/free_05.jpg">
                </a>
            </li>
      		<li>
            	<a href="#">
					<img src="images/loading.gif" data-original="images/free_07.jpg">
                </a>
            </li>
      	</ul>
      </div>
   </div>
</div>
<!--免费专区 end--><!--免费专区 start-->
<div class="free">
   <div class="inner wrap">
   	  <h2>免费专区</h2>
      <p>天下没有免费的午餐，传智云课堂有免费的学习</p>
      <div class="free-desk">
      	<ul>
      		<li>
            	<a href="#">
					<img src="images/loading.gif" data-original="images/free_03.jpg">
                </a>
            </li>
      		<li class="free-desk-m">
            	<a href="#">
					<img src="images/loading.gif" data-original="images/free_05.jpg">
                </a>
            </li>
      		<li>
            	<a href="#">
					<img src="images/loading.gif" data-original="images/free_07.jpg">
                </a>
            </li>
      	</ul>
      </div>
   </div>
</div>
<!--免费专区 end--><!--免费专区 start-->
<div class="free">
   <div class="inner wrap">
   	  <h2>免费专区</h2>
      <p>天下没有免费的午餐，传智云课堂有免费的学习</p>
      <div class="free-desk">
      	<ul>
      		<li>
            	<a href="#">
					<img src="images/loading.gif" data-original="images/free_03.jpg">
                </a>
            </li>
      		<li class="free-desk-m">
            	<a href="#">
					<img src="images/loading.gif" data-original="images/free_05.jpg">
                </a>
            </li>
      		<li>
            	<a href="#">
					<img src="images/loading.gif" data-original="images/free_07.jpg">
                </a>
            </li>
      	</ul>
      </div>
   </div>
</div>
<!--免费专区 end-->

<!--vip专区 start-->
<div class="vip">
	<div class="inner wrap">
       <h2>传智云课堂VIP课程</h2>
       <div class="all">
       		<a href="#" class="current">全部课程
            	<span class="arrow"></span>
            </a> 
       		<a href="#">UI设计</a>
       		<a href="#">平面设计</a>
       		<a href="#">淘宝设计</a>
       		<a href="#">网页设计</a>
       </div>
       <div class="content clearfix">
       	  <ul>
       	  	<li>
            	<div class="con-img">
                	 <a href="#">
                         <img src="images/pic_03.jpg" alt="">
                         
                         <div class="play">
                            <img src="images/play_06.png" alt="">
                         </div>  
                     </a>  				
                </div>
            	<div class="con-title">
                	<h2><span>Photoshop精品班</span>  <span class="price">¥1400.00</span> </h2>
                    <p>课程以基础入门为主，详细讲解软件的每一个工具的使用与技巧，让喜欢PS的你能够对软件迅速熟练及运用
</p>	
                </div>
            	<div class="con-buy">
                	已经有3215人购买 <a href="#">去看看</a>
                </div>
            </li>
       	  	<li>
            	<div class="con-img">
                	 <a href="#">
                         <img src="images/pic_03.jpg" alt="">
                         
                         <div class="play">
                            <img src="images/play_06.png" alt="">
                         </div>  
                     </a>  				
                </div>
            	<div class="con-title">
                	<h2><span>Photoshop精品班</span>  <span class="price">¥1400.00</span> </h2>
                    <p>课程以基础入门为主，详细讲解软件的每一个工具的使用与技巧，让喜欢PS的你能够对软件迅速熟练及运用
</p>	
                </div>
            	<div class="con-buy">
                	已经有3215人购买 <a href="#">去看看</a>
                </div>
            </li>
       	  	<li class="nomargin">
            	<div class="con-img">
                	 <a href="#">
                         <img src="images/pic_03.jpg" alt="">
                         
                         <div class="play">
                            <img src="images/play_06.png" alt="">
                         </div>  
                     </a>  				
                </div>
            	<div class="con-title">
                	<h2><span>Photoshop精品班</span>  <span class="price">¥1400.00</span> </h2>
                    <p>课程以基础入门为主，详细讲解软件的每一个工具的使用与技巧，让喜欢PS的你能够对软件迅速熟练及运用
</p>	
                </div>
            	<div class="con-buy">
                	已经有3215人购买 <a href="#">去看看</a>
                </div>
            </li>
       	  	<li>
            	<div class="con-img">
                	 <a href="#">
                         <img src="images/pic_03.jpg" alt="">
                         
                         <div class="play">
                            <img src="images/play_06.png" alt="">
                         </div>  
                     </a>  				
                </div>
            	<div class="con-title">
                	<h2><span>Photoshop精品班</span>  <span class="price">¥1400.00</span> </h2>
                    <p>课程以基础入门为主，详细讲解软件的每一个工具的使用与技巧，让喜欢PS的你能够对软件迅速熟练及运用
</p>	
                </div>
            	<div class="con-buy">
                	已经有3215人购买 <a href="#">去看看</a>
                </div>
            </li>
       	  	<li>
            	<div class="con-img">
                	 <a href="#">
                         <img src="images/pic_03.jpg" alt="">
                         
                         <div class="play">
                            <img src="images/play_06.png" alt="">
                         </div>  
                     </a>  				
                </div>
            	<div class="con-title">
                	<h2><span>Photoshop精品班</span>  <span class="price">¥1400.00</span> </h2>
                    <p>课程以基础入门为主，详细讲解软件的每一个工具的使用与技巧，让喜欢PS的你能够对软件迅速熟练及运用
</p>	
                </div>
            	<div class="con-buy">
                	已经有3215人购买 <a href="#">去看看</a>
                </div>
            </li>
       	  	<li class="nomargin">
            	<div class="con-img">
                	 <a href="#">
                         <img src="images/pic_03.jpg" alt="">
                         
                         <div class="play">
                            <img src="images/play_06.png" alt="">
                         </div>  
                     </a>  				
                </div>
            	<div class="con-title">
                	<h2><span>Photoshop精品班</span>  <span class="price">¥1400.00</span> </h2>
                    <p>课程以基础入门为主，详细讲解软件的每一个工具的使用与技巧，让喜欢PS的你能够对软件迅速熟练及运用
</p>	
                </div>
            	<div class="con-buy">
                	已经有3215人购买 <a href="#">去看看</a>
                </div>
            </li>
       	  	<li>
            	<div class="con-img">
                	 <a href="#">
                         <img src="images/pic_03.jpg" alt="">
                         
                         <div class="play">
                            <img src="images/play_06.png" alt="">
                         </div>  
                     </a>  				
                </div>
            	<div class="con-title">
                	<h2><span>Photoshop精品班</span>  <span class="price">¥1400.00</span> </h2>
                    <p>课程以基础入门为主，详细讲解软件的每一个工具的使用与技巧，让喜欢PS的你能够对软件迅速熟练及运用
</p>	
                </div>
            	<div class="con-buy">
                	已经有3215人购买 <a href="#">去看看</a>
                </div>
            </li>
       	  	<li>
            	<div class="con-img">
                	 <a href="#">
                         <img src="images/pic_03.jpg" alt="">
                         
                         <div class="play">
                            <img src="images/play_06.png" alt="">
                         </div>  
                     </a>  				
                </div>
            	<div class="con-title">
                	<h2><span>Photoshop精品班</span>  <span class="price">¥1400.00</span> </h2>
                    <p>课程以基础入门为主，详细讲解软件的每一个工具的使用与技巧，让喜欢PS的你能够对软件迅速熟练及运用
</p>	
                </div>
            	<div class="con-buy">
                	已经有3215人购买 <a href="#">去看看</a>
                </div>
            </li>
       	  	<li class="nomargin">
            	<div class="con-img">
                	 <a href="#">
                         <img src="images/pic_03.jpg" alt="">
                         
                         <div class="play">
                            <img src="images/play_06.png" alt="">
                         </div>  
                     </a>  				
                </div>
            	<div class="con-title">
                	<h2><span>Photoshop精品班</span>  <span class="price">¥1400.00</span> </h2>
                    <p>课程以基础入门为主，详细讲解软件的每一个工具的使用与技巧，让喜欢PS的你能够对软件迅速熟练及运用
</p>	
                </div>
            	<div class="con-buy">
                	已经有3215人购买 <a href="#">去看看</a>
                </div>
            </li>
       	  </ul>
       </div>
       <a href="#" class="more">更多课程</a>
    </div>
</div>



<!--footer部分 start-->
<footer class="footer">
	<div class="footer-t">
    	<div class="footer-con wrap">
        	 <dl>
        	 	<dt>新手入门</dt>
        	 	<dd><a href="#">如何注册</a></dd>  
        	 	<dd><a href="#">如何登录</a></dd>  
        	 	<dd><a href="#">账号设置</a></dd>  
        	 	<dd><a href="#">账号安全</a></dd>  
  	         </dl>    	
        	 <dl>
        	 	<dt>新手入门</dt>
        	 	<dd><a href="#">如何注册</a></dd>  
        	 	<dd><a href="#">如何登录</a></dd>  
        	 	<dd><a href="#">账号设置</a></dd>  
        	 	<dd><a href="#">账号安全</a></dd>  
  	         </dl>    	
        	 <dl>
        	 	<dt>新手入门</dt>
        	 	<dd><a href="#">如何注册</a></dd>  
        	 	<dd><a href="#">如何登录</a></dd>  
        	 	<dd><a href="#">账号设置</a></dd>  
        	 	<dd><a href="#">账号安全</a></dd>  
  	         </dl>    	
        	 <dl>
        	 	<dt>新手入门</dt>
        	 	<dd><a href="#">如何注册</a></dd>  
        	 	<dd><a href="#">如何登录</a></dd>  
        	 	<dd><a href="#">账号设置</a></dd>  
        	 	<dd><a href="#">账号安全</a></dd>  
  	         </dl>
             <div class="erweima">
             	<img src="images/erweima_07.jpg" alt="">
             </div>    	
        </div>
    </div>
	<div class="footer-b">
    	<p class="wrap">版权所有 2006 - 2015 北京传智播客教育科技有限公司   京ICP备08001421号京公网安备110108007702</p>
    </div>

</footer>


















</body>
</html>
